<template>
	<view>
		<!-- <image class="BGImage1" src="/static/login/bg.png" mode=""></image> -->

		<!-- <view class="title flex-row-center">
			爱尚陪玩
		</view>
		<view class="text">
			<text>
				{{text}}
			</text>
		</view> -->
		<view class="login_t">
			<!-- <image src="../../static/bj.png" mode=""></image> -->
			<view class="login_text1">
				你好，
			</view>
			<view class="login_text2">
				欢迎来到960陪伴用户端
			</view>

		</view>

		<view class=""
			style="background-color: #fff;border-radius: 30rpx 30rpx 0 0;margin-top: -100rpx;padding-top: 20rpx;">
			<view class="phoneView">
				<input type="number" v-model="phone" placeholder="输入手机号" maxlength="11"
					placeholder-style="color:#999999">
			</view>
			<view class="phoneView1 flex-row-center">
				<input class="flex1" type="number" v-model="code" placeholder="验证码" maxlength="6"
					placeholder-style="color:#999999">
				<view @click="sendMsg" class="button">
					{{ msg }}
				</view>
			</view>


			<view class="xzView flex-row-flex-start">
				<image @click="xzClik()" v-if="!isXz" class="icon" src="/static/login/wxz.png" mode=""></image>
				<image @click="xzClik()" v-if="isXz" class="icon" src="/static/login/xz.png" mode=""></image>
				是否同意 <text @click="topath('privacy')">《隐私政策》</text>和<text @click="topath('privacy1')">《服务协议》</text>
			</view>

			<view @click="submit" class="loginButton flex-row-center">
				登录
			</view>
			<!-- <view @click="getLogin" class="loginButton flex-row-center">
				wx
			</view> -->
		</view>
		<!-- 	<view class="" style="height: 600rpx;">
		
	</view> -->
	</view>
</template>
<script>
	var clear;
	import {
		mapState,
		mapMutations
	} from 'vuex';
	export default {
		data() {
			return {
				isXz: true,
				text: '商务接待、旅游出行、休闲娱乐、选爱尚陪玩。\n高端私人达人，一对一贴心服务。\n伴你度过愉快的每一天，期待你的到来，我在爱尚陪玩等你哦!',
				phone: '',
				code: '',
				code2: '',
				msg: '获取验证码',
				checked: true,
				pid: null, //分销商id
			}
		},
		computed: {
			...mapState(['userInfo'])
		},
		onShow() {
			let isIndex = uni.getStorageSync('isIndex')
			// console.log(isIndex);
			// console.log(this.pid);
			if (this.pid && this.userInfo.data.token.token) {
				console.log('onload调用');
				this.partner()
			}
			if (isIndex) {
				uni.switchTab({
					url: '/pages/index/indexNew'
				});
			}

		},
		onLoad(arr) {
			this.pid = arr.pid || null
			// console.log();
			if (arr.code) {
				this.code2 = arr.code
			}
			let shareCode = uni.getStorageSync("shareCode");
			if (shareCode) {
				this.code2 = shareCode
			}


		},
		methods: {
			...mapMutations(['setUserInfo']),
			//扫码分销商存储pid
			partner() {
				console.log(this.pid);

				this.$http.post('api/bind/partner', {
					pid: this.pid
				}).then(res => {
					console.log(res);
					uni.showToast({
						title: '绑定成功',
						// title: res.msg,
						icon: 'none',
					})

				})
			},
			xzClik() {
				this.isXz = !this.isXz
			},
			// 发送验证码
			topath(e) {
				if (e == "privacy") {
					uni.navigateTo({
						url: "/bundle/pages/web/web?title=privacy"
					})
				} else {
					uni.navigateTo({
						url: "/bundle/pages/web/web?title=service"
					})
				}

			},
			sendMsg() {
				if (this.readonly) {
					return;
				}
				if (!this.phone) {
					uni.showToast({
						title: '请输入手机号',
						icon: 'none'
					});
					return;
				}
				if (!this.$base.phoneRegular.test(this.phone)) {
					uni.showToast({
						title: '手机号格式不正确',
						icon: 'none'
					});
					return;
				}
				uni.request({
					url: 'https://play.bozhoukeji.cn/api/send/sms',
					method: 'POST',
					header: {
						'Content-Type': 'application/json',
						token: uni.getStorageSync("TOKEN")
					},
					data: {
						phone: this.phone,
						type: 0
					},
					success: res => {
						console.log(res);
						this.getCodeState();
					},
					fail: (err) => {
						console.log(err);
					},
					complete: () => {}
				});

				// this.$http.post('api/send/sms', {
				// 	phone: this.phone,
				// 	type: 'other'
				// }).then(res => {
				// 	console.log(res);
				// 	this.getCodeState();
				// });
			},
			//验证码按钮文字状态
			getCodeState() {
				clear && clearInterval(clear);
				const _this = this;
				this.readonly = true;
				this.msg = '60S';
				var s = 60;
				clear = setInterval(() => {
					s--;
					_this.msg = s + 'S';
					if (s <= 0) {
						clearInterval(clear);
						_this.msg = '获取验证码';
						_this.readonly = false;
					}
				}, 1000);
			},
			sendMessage() {
				WeixinJSBridge.on('menu:share:timeline', function(argv) {

					WeixinJSBridge.invoke('shareTimeline', {

						"appid": "", //appid 设置空就好了。
						"img_url": imgUrl, //分享时所带的图片路径
						"img_width": "120", //图片宽度
						"img_height": "120", //图片高度
						"link": url, //分享附带链接地址
						"desc": "我是一个介绍", //分享内容介绍
						"title": "标题，再简单不过了。"
					}, function(res) {
						/*** 回调函数，最好设置为空 ***/
					});

				});
			},


			submit() {
				if (!this.isXz) {
					uni.showToast({
						title: '请同意协议',
						icon: 'none'
					});
					return;
				}
				if (!this.phone) {
					uni.showToast({
						title: '请输入手机号',
						icon: 'none'
					});
					return;
				}
				console.log(this.checked, '*-*-');
				if (!this.checked) {
					uni.showToast({
						title: '请同意协议',
						icon: 'none'
					});
					return;
				}
				if (!this.$base.phoneRegular.test(this.phone)) {
					uni.showToast({
						title: '手机号格式不正确',
						icon: 'none'
					});
					return;
				}
				if (!this.code) {
					uni.showToast({
						title: '请输入验证码',
						icon: 'none'
					});
					return;
				}
				this.$http.post('api/login/phone_smscode', {

					phone: this.phone,
					sms_code: this.code,
					code: this.code2

				}).then(res => {
					console.log(res, 'HHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHH****');
					if (res.token) {
						uni.setStorageSync('userInfo', {
							token: res
						})
						// console.log(this.pid, 111111111111111111111111111111);
						if (this.pid) {
							console.log('登录调用');
							this.partner()
						}
						uni.showToast({
							title: '登录成功',
							icon: 'none',
						})
						// uni.switchTab({
						// 	url: '/pages/index/indexNew'
						// });
						// #ifdef APP-PLUS
						uni.setStorageSync('isIndex', 1)
						uni.showToast({
							title: '登录成功',
							icon: 'none',
						})
						uni.switchTab({
							url: '/pages/index/indexNew'
						});
						// #endif
						// #ifdef H5
					uni.setStorageSync('isIndex', 1)
					uni.showToast({
						title: '登录成功',
						icon: 'none',
					})
					uni.switchTab({
						url: '/pages/index/indexNew'
					});
						// if (!res.openid) {
						// 	uni.setStorageSync('isIndex', 1)
						
						// 	setTimeout(() => {
						// 		this.getLogin()
						// 	}, 2000)

						// } else {
						// 	uni.setStorageSync('isIndex', 1)
						// 	uni.showToast({
						// 		title: '登录成功',
						// 		icon: 'none',
						// 	})
						// 	setTimeout(() => {
						// 		this.getLogin()
						// 	}, 2000)


						// }
						// #endif
						
					} else {
						uni.navigateTo({
							url: '/pages/user/passWord?type=1&code=' + res.temp_token
						})

					}

				});
			},
			checkboxChange() {
				this.checked = !this.checked
				console.log(this.checked);
			},
			getLogin() {

				let baseurl = ''
				if (process.env.NODE_ENV === 'development') {
					baseurl = 'https://play.bozhoukeji.cn/h5'; // 这里做一下转译，要不然微信会忽略到#后面的参数
				} else {
					baseurl = location.origin; // 这里做一下转译，要不然微信会忽略到#后面的参数
				}
				let redirectURL = encodeURIComponent(
					(
						baseurl +
						window.location.pathname +
						window.location.hash
					).split("&code")[0]
				); //获取地址
				console.log(redirectURL, '8998');
				const base = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=";
				let appid = 'wx1249cbdd2f95f2d1'; //应用授权作用域
				let scope = "snsapi_userinfo";
				window.location.href =
					base +
					appid +
					"&redirect_uri=" +
					redirectURL +
					"&response_type=code&scope=" +
					scope +
					'&state=' + encodeURIComponent(location.origin) +
					"#wechat_redirect";
				
			},

		}
	}
</script>
<style lang="scss" scoped>
	.BGImage1 {
		position: fixed;
		width: 100%;
		height: 100%;
		bottom: 0;
		top: 0;
		left: 0;
		z-index: -1;
	}

	page {
		padding-top: 24rpx;

		background-color: #FFFFFF00;

	}


	.login_t {
		width: 100%;
		height: 444rpx;
		background-image: url("../../static/bj.png");
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
	}

	.login_text1 {
		padding-top: 122rpx;
		padding-bottom: 10rpx;
	}

	.login_text1,
	.login_text2 {
		// width: 144rpx;
		// height: 72rpx;
		padding-left: 48rpx;
		padding-right: 48rpx;
		font-size: 48rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
		line-height: 72rpx;

	}

	// .title {
	// 	// margin-top: 24rpx;
	// 	/* #ifdef MP||APP-PLUS */
	// 	padding-top: $MPTop;
	// 	/* #endif */
	// 	font-size: 60rpx;
	// 	font-family: PingFang SC-Bold, PingFang SC;
	// 	font-weight: bold;
	// 	color: #FFFFFF;
	// }

	// .text {
	// 	margin-left: 54rpx;
	// 	margin-top: 12rpx;
	// 	margin-right: 34rpx;
	// 	font-size: 26rpx;
	// 	font-family: PingFang SC-Medium, PingFang SC;
	// 	// font-weight: 500;
	// 	color: #FFFFFF;
	// }

	.phoneView {
		margin: 26rpx 56rpx;
		padding-left: 44rpx;
		height: 106rpx;
		background: #F7F8FA;
		border-radius: 70rpx 70rpx 70rpx 70rpx;

		// opacity: 0.3;
		input {
			width: 100%;
			height: 100%;
			color: #999;
		}
	}

	.phoneView1 {
		margin: 26rpx 56rpx;
		margin-top: 48rpx;
		padding-left: 44rpx;
		height: 106rpx;
		background: #F7F8FA;
		border-radius: 70rpx 70rpx 70rpx 70rpx;

		// opacity: 0.3;
		input {
			// width: 100%;
			height: 100%;
			color: #999;
		}
	}

	.button {
		width: 200rpx;
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		// font-weight: 500;
		color: #999;
	}

	.icon {
		width: 40rpx;
		height: 40rpx;
		margin-right: 10rpx;
	}

	.xzView {
		margin-left: 82rpx;
		margin-top: 4rpx;
		font-size: 24rpx;
		font-weight: 400;
		color: #999;
	}

	.xyTitle {
		font-size: 24rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
	}

	.loginButton {
		margin: 40rpx 56rpx;
		height: 106rpx;
		background: linear-gradient(88deg, #C74BF0 0%, #8438FC 100%);
		border-radius: 70rpx 70rpx 70rpx 70rpx;
		opacity: 1;
		font-size: 32rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
	}
</style>